<template>
  <div>
    <h2>自定义带Hover提示的按钮</h2>

    <child aa="bb"  :xx="{n:2}"  @click="test" @xxx="test"></child>


   <!-- 封装自己的带提示按钮 -->
   <!-- <el-button type="primary"  size="mini" icon="el-icon-plus">添加</el-button>
   <el-button type="warning" size="mini" icon="el-icon-edit">修改</el-button>
   <el-button type="danger" size="mini"  icon="el-icon-delete">删除</el-button> -->
  

  <HintButton  type="primary"  size="mini" icon="el-icon-plus" title="添加"></HintButton>
  <HintButton  type="warning" size="mini" icon="el-icon-edit" title="修改"></HintButton>
  <HintButton  type="danger" size="mini"  icon="el-icon-delete"  title="删除"></HintButton>

       <!-- element-ui按钮，自定义事件变成原生DOM事件 -->
    <el-button  type="primary" @dblclick.native="test"></el-button>
  </div>
</template>

<script type="text/ecmascript-6">
import child from './child.vue'
import HintButton from './HintButton.vue'
  export default {
    name: 'AttrsListenersTest',
    components:{
      child,
      HintButton
    },
    methods: {
        test(){
            console.log(111);
        }
    },
  }
</script>
